<template>
  <el-dialog
    v-el-drag-dialog
    :title="'未签收未回执订单详情'"
    :visible.sync="visible"
    width="1440px"
    @close="reset"
  >
    <div class="tableGroup">
      <lb-table
        ref="lbTable"
        v-loading="$loadingPlugin.fetchData"
        class="one"
        border
        highlight-current-row
        height="500"
        element-loading-text="加载中"
        :column="tableData.column"
        :data="tableData.data"
        pagination
        :total="tableData.total"
        custom-column
        @fetch="fetchData"
      />
    </div>
    <!-- 线上 onLine  月结支付 yj 预付支付：csmcard 现金支付：money 应totalMoney1   实totalMoney2 -->
    <div slot="footer" class="dialog-footer">
      <span v-if="csmCardOrderCode" id="order_newReceipt_sign_showCsmcardOrderCodeDiv" style="float: left; margin-left: 20px; font-size: 16px; color: red;">{{ csmCardOrderCode }}订单支付状态为预支付,请注意核对</span>
      <el-button @click="reset">
        关闭
      </el-button>
      <!-- <el-button :loading="$loadingPlugin.success " type="primary" @click="success">
        确认回执
      </el-button> -->
    </div>
  </el-dialog>
</template>

<script>
  import { orderbillNewReceiptDetailed } from '@/api'
  import { parseTime } from '@/utils'
  // import tableData from './data.json'
  export default {
    name: 'detail',
    props: ['payStatusMap', 'paymentMethodMap'],
    data() {
      return {
        visible: false,
        // 线上 onLine  月结支付 yj 预付支付：csmcard 现金支付：money 应totalMoney1   实totalMoney2
        onLine: 0,
        yj: 0,
        csmcard: 0,
        money: 0,
        totalMoney1: 0,
        totalMoney2: 0,
        csmCardOrderCode: null,
        searchParams: {},
        selectTable: [],
        tableData: {
          total: 0,
          column: [
            { label: '下单日期', prop: 'transactTime', width: '', align: 'center',
              render: (h, { row }) => <span>{ row.transactTime && parseTime(row.transactTime, '{y}-{m}-{d} {h}:{i}:{s}') }</span>
            },
            { label: '订单号', prop: 'orderCode', width: '', align: 'left' },
            { label: '客户名称', prop: 'csmName', width: '', align: 'center' },
            { label: '联系电话', prop: 'csmPhone', width: '', align: 'center' },
            { label: '商品描述', prop: 'goodsDesc', width: '', align: 'left' },
            { label: '配送员', prop: 'ownerName', width: '', align: 'center' },
            { label: '应收金额', prop: 'treceivables', width: '', align: 'right' }
          ],
          data: []
        }
      }
    },
    methods: {
      async fetchData({ currentPage = 1, pageSize = 20 }) {
        const params = {
          ...this.searchParams,
          currentPage,
          pageSize
        }

        const res = await orderbillNewReceiptDetailed(params)
        this.tableData.data = res.data.rows
        if (currentPage === 1) this.tableData.total = res.data.total
        // this.flexColumnWidth()
      },
      open(row) {
        return new Promise(resolve => {
          this.resolve = resolve
          this.visible = true
          this.searchParams = { ...row }
          this.fetchData({})
        })
      },
      reset() {
        this.$nextTick(() => {
          this.goodsTable.data = []
          this.tableData.data = []
          this.onLine = 0
          this.yj = 0
          this.csmcard = 0
          this.money = 0
          this.totalMoney1 = 0
          this.totalMoney2 = 0
          this.csmCardOrderCode = 0
          this.visible = false
        })
      }
    }
  }
</script>

<style lang="scss" scoped>

</style>
